<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <title>测试视频</title>
    <link href="./style/video-js.min.css" rel="stylesheet">
    <link href="./style/a.css" rel="stylesheet">
    <style>
        body {
            background-color: #191919
        }
    </style>
</head>

<body>
<div class="item">
    <div class="player" style="margin-top:300px">
        <video id="my-video" class="video-js vjs-custom-skin vjs-big-play-centered  vjs-big-play-centered vjs-16-9"
               x5-video-player-type="h5" x5-video-player-fullscreen="true" controls preload="auto" width="100%"
               height="auto"
               poster="./resources/cover.png"
               data-setup="{}"
               style="object-fit:fill"
        >
            <!--webkit-playsinline="true"-->
            <!--playsinline="true"-->
            <!--x-webkit-airplay="true"-->
            <!--x5-video-player-type="h5"-->
            <!--x5-video-player-fullscreen="true"-->
            <!--x5-video-orienation="portraint"-->

            <source src="./resources/video.mp4" type="video/mp4">
            <source src="http://vjs.zencdn.net/v/oceans.webm" type="video/webm">
            <source src="http://vjs.zencdn.net/v/oceans.ogv" type="video/ogg">
            <p class="vjs-no-js"> To view this video please enable JavaScript, and consider upgrading to a web browser
                that <a href="http://videojs.com/html5-video-support/" target="_blank">supports HTML5 video</a></p>
        </video>
    </div>
</div>
<script src="./style/video.min.js"></script>
<script type="text/javascript">
    //设置中文

    //默认调用
    var options = {};
    var player = videojs("my-video", options, {
        // "autoplay":'muted',
        "loop": 'true',  //循环
        controlBar: {
            captionsButton: false,
            chaptersButton: false,
            liveDisplay: false,
            playbackRateMenuButton: false,
            subtitlesButton: false
        }

    }, function () {
    });
    player.on('ended', function () {
        this.pause();
        this.hide()
    })
    player.on("timeupdate", function () {
        if ((this.duration() - this.currentTime()) < 0.9) {
            this.pause();
            this.currentTime(0);
        }
    })

    player.on("pause", function () { // 暂停时重置时间 就不会在微信端弹广告
        this.currentTime(this.currentTime());
    })

    player.autoplay('muted');

</script>
</body>
</html>
